<template>
  <div>
      <div class="todybuy">
          <div v-for="(v,i) in arr" :key="i" class="shownavname" @click="fun(i)">
                <shownavs :shownavname="arr[i].name" :shownavimgurl="arr[i].imgurl"/>
          </div>
      </div>
  </div>
</template>

<script>
import {getdata} from "@/api/getapi.js"
import shownavs from './shownavs.vue'
export default {
    components:{
        shownavs
    },
    data() {
        return {
            arr:[]
            
        }
    },
    methods: {
        fun(i){
             this.$router.push({name:"Showxiangqing",params:{xiangqing:this.arr[i]}})
        }
    },
    mounted() {
         getdata("/data/list").then((ok)=>{
            console.log(ok);
            this.arr=ok.data.arr4
        })
    },
}
</script>

<style scoped>
.todybuy{
    width: 100%;
    display: flex;
}
    .shownavname{
        /* width: 30%; */
        flex: 1;
        font-size: 14px;
        text-align: center;
    }
</style>